<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单元素</title>
</head>
<body>
<!--form表单要提交的地方action-->
<!--提交方式为method-->
<!--get url参数可见不安全且长度不限-->
<!--post url参数不可见安全且长度有限制-->
<form  method="get" action="注册成功.html">
    <table border="1">
        <tr>
            <td><label for="username">用户名：</label></td>
            <td>
                <input id="username"  placeholder="请输入用户名称" name="username" type="text" size="15" maxlength="5"/>
            </td>
        </tr>
        <tr>
            <td>密码：</td>
            <td>
                <!--               required为必填项-->
                <input  placeholder="请输入密码" name="passeord" type="password" required />
            </td>
        </tr>
        <tr>
            <td>确认密码：</td>
            <td>
                <input name="passweord" type="password"/>
            </td>
        </tr>
        <tr>
            <td>爱好</td>
            <td>
                <input checked name="hobby1" type="checkbox" value="篮球"/>篮球
                <input name="hobby2" type="checkbox" value="游泳"/>游泳
            </td>
        </tr>
        <tr>
            <td>性别</td>
            <td>
<!--                name一样的时候单选按钮才会产生互斥效果-->
                <input name="sex" type="radio" value="女"/>女
                <input checked name="sex" type="radio" value="男"/>男
            </td>
        </tr>
        <tr>
            <td>头像</td>
            <td>
                <input name="logo" type="file"/>
            </td>
        </tr>
        <tr>
            <td>邮箱</td>
            <td>
                <input name="email" type="email"/>
            </td>
        </tr>
        <tr>
            <td>网址</td>
            <td>
                <input name="url" type="url"/>
            </td>
        </tr>
        <tr>
            <td>数字</td>
            <td>
                <input name="number" type="number" min="0" max="100" step="2"/>
            </td>
        </tr>
        <tr>
            <td>滑块</td>
            <td>
                <input name="range" type="range"/>
            </td>
        </tr>
        <tr>
            <td>搜索框</td>
            <td>
                <input name="search" type="search"/>
            </td>
        </tr>
        <tr>
            <td>下拉框</td>
            <td>
                <select name="major">
                    <option>请选择</option>
                    <option value="1">土木</option>
                    <option selected>大数</option>
                    <option>软工</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>多行文本域</td>
            <td>
<!--                readonly为只读-->
                <textarea cols="30" rows="5" readonly>
                    最终解释权
                </textarea>
            </td>
        </tr>
        <tr>
            <td>按钮</td>
            <td>
                <input type="image" src="image/img1.png" width="80"/>
                <input type="button" value="普通按钮" disabled/>
            </td>
        </tr>
        <tr>
            <td>手机号</td>
            <td>
                <input type="text" name="tel" pattern="^1[358]\d{9}"/>
            </td>
        </tr>
        <tr>
            <td>
                <input type="submit" value="注册">
            </td>
            <td>
                <input type="reset" value=" 重置">
            </td>
        </tr>
    </table>
</form>
</body>
</html>